<!DOCTYPE html>
<!--suppress ALL-->
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" style="overflow: hidden;height: 100%;">
<!--/* 加载IE8兼容性片段 */-->
<head>
    <title text="数据资产"></title>
    <!--/* 加载全局样式 */-->
    <th:block th:replace="common/thinDecorator::globalStyle"></th:block>
    <link th:href="@{/static/global/plugins/bootstrap-sweetalert/sweetalert.css}" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" th:href="@{/static/global/plugins/bootstrap-fileinput/bootstrap-fileinput.css}">
    <link rel="stylesheet" th:href="@{/Vue/ElemtUI/ElementIndex.css}">
    <!--/* 加载全局主题样式 */-->
    <th:block th:replace="common/thinDecorator::globalThemeStyle"></th:block>
    <!--/* 加载全局布局样式 */-->
    <th:block th:replace="common/thinDecorator::globalLayoutStyle"></th:block>
    <link rel="stylesheet" th:href="@{/static/global/plugins/elementUI/index.css}">
    <link th:href="@{/static/style.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/index.css}" rel="stylesheet" type="text/css"/>
    <script>
        if (top !== window) {
            top.location.href = window.location.href;
        }
        try {
            window.nodeRequire = require;
            delete window.require;
            delete window.exports;
            delete window.module;
            delete window.JS_MD5_NO_COMMON_JS;
            delete window.process;
        } catch (e) {

        }
    </script>
</head>
</head>
<!-- END HEAD -->
<body class="system-index">
<div id="app" v-cloak :class="isLight ? '' : 'dark'">
    <div class="left" :class="collapse ? 'menuClose' : ''">
        <div class="left-top">
            <div class="system-title">{{systemTitle}}</div>
        </div>
        <div class="left-body">
            <el-scrollbar style="height: 100%">
                <el-menu class="el-menu-vertical-demo" ref="menus" :collapse="collapse" :background-color="isLight ? '' : '#191923'" :text-color="isLight ? '' : '#FFFFFF'" :active-text-color="isLight ? '' : '#FFFFFF'">
                    <template v-for="item in resouces">
                        <el-submenu :index="item.name" :key="item.mid" v-if="Array.isArray(item.children) && item.children.length > 0">
                            <template slot="title">
                                <i :class="item.icon ? item.icon : 'el-icon-menu'"></i>
                                <span slot="title" :title="item.name">{{item.name}}</span>
                            </template>
                            <template v-for="citem in item.children">
                                <el-submenu :index="citem.name" :key="citem.mid" v-if="Array.isArray(citem.children) && citem.children.length > 0">
                                    <template slot="title">
                                        <i :class="citem.icon ? citem.icon : 'el-icon-menu'"></i>
                                        <span slot="title" :title="citem.name">{{citem.name}}</span>
                                    </template>
                                    <template v-for="sitem in citem.children">
                                        <el-menu-item :index="sitem.name" :key="sitem.mid" @click="resourceSelect(sitem)">
                                            <i :class="sitem.icon ? sitem.icon : 'el-icon-menu'"></i>
                                            <span slot="title" :title="sitem.name">{{sitem.name}}</span>
                                        </el-menu-item>
                                    </template>
                                </el-submenu>
                                <el-menu-item :index="citem.name" :key="citem.mid" v-else @click="resourceSelect(citem)">
<!--                                    <i :class="citem.icon ? citem.icon : 'el-icon-menu'"></i>-->
                                    <span slot="title" :title="citem.name">{{citem.name}}</span>
                                </el-menu-item>
                            </template>
                        </el-submenu>
                        <el-menu-item :index="item.name" :key="item.mid" v-else @click="resourceSelect(item)">
                            <i :class="item.icon ? item.icon : 'el-icon-menu'"></i>
                            <span slot="title" :title="item.name">{{item.name}}</span>
                        </el-menu-item>
                    </template>
                </el-menu>
            </el-scrollbar>
        </div>
    </div>
    <div class="right">
        <div class="right-top">
            <div class="menu-type-switch">
                <i class="icon-center" :class="collapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'" @click="collapse = !collapse"></i>
            </div>
            <div class="menu-group">
                <div class="menu-group-control" :style="{'opacity': groupShow}">
                    <el-menu :default-active="groupActive" class="el-menu-demo" mode="horizontal" @select="groupSelect">
                        <template v-for="item in groups">
                            <el-menu-item :index="item.name" :key="item.mid" v-if="item.children">{{item.name}}</el-menu-item>
                        </template>
                    </el-menu>
                </div>
            </div>
            <div class="other">
                <div class="other-item">
                    <i class="icon-center el-icon-moon" :class="isLight ? 'el-icon-moon' : 'el-icon-sunny'" :title="isLight ? '夜间模式' : '白昼模式'" @click="isLight = !isLight"></i>
                </div>
                <div class="other-item">
                    <el-popover
                            placement="bottom"
                            width="300"
                            trigger="hover">
                        <div class="clearfix">
                            <span>您有<span class="bold">{{total > 10 ? '10+' : total}}</span>条未读通知</span>
                            <el-button style="float: right; padding: 3px 0" type="text" @click="resourceSelect({name: '站内信',url: '/notice/inmail/list'})">查看所有</el-button>
                        </div>
                        <el-divider></el-divider>
                        <div class="noticesPanel" style="height: 200px;overflow: hidden">
                            <el-scrollbar style="height: 100%;">
                                <div v-for="item in rows" :key="item.mid" class="text item" @click="showInmail(item.mid,item.url);">{{item.title}}</div>
                            </el-scrollbar>
                        </div>
                        <el-badge slot="reference" :value="total" :max="10" class="item" type="primary">
                            <i class="icon-center el-icon-bell"></i>
                        </el-badge>
                    </el-popover>
                </div>
            </div>
        </div>
        <div class="right-tab" style="width: 100%">
            <div class="fixed-tabs">
                <el-tag effect="plain" v-for="item in fixedTags" :class="item.name == activeTag ? 'active' : ''" @click="switchTag(item)">{{item.name}}</el-tag>
            </div>
            <div class="other-tabs" style="position: relative">
                <div id="tagsView" style="position: absolute; top: 0;left: 0; right: 0;height: 100%;overflow: hidden;">
                    <div class="tabs-list">
                        <el-tag effect="plain" v-for="item in tags" :class="item.name == activeTag ? 'active' : ''" @click="switchTag(item)" closable @close="removeNav(item.name)">{{item.name}}</el-tag>
                    </div>
                </div>
            </div>
            <div class="tab-refresh">
                <i class="icon-center el-icon-refresh-right" @click="to_Refresh(null)"></i>
            </div>
        </div>
        <div class="right-body">
            <div class="frame-item" v-for="item in fixedTags" :class="item.name == activeTag ? 'active' : ''" :key="item.name">
                <iframe width="100%" height="100%" frameborder="no" allowtransparency="yes" border="no" scrolling="no" :src="setIframeUrl(item)"></iframe>
            </div>
            <div class="frame-item" v-for="item in tags" :class="item.name == activeTag ? 'active' : ''" :key="item.name">
                <iframe width="100%" height="100%" frameborder="no" border="no" scrolling="no" allowtransparency="yes" :src="setIframeUrl(item)"></iframe>
            </div>
        </div>
    </div>
</div>
<div id="scripts">
    <!--/* 加载IE8兼容性脚本 */-->
    <th:block th:replace="common/thinDecorator::IE8FixScripts"/>
    <!--/* 加载核心插件脚本 */-->
    <th:block th:replace="common/thinDecorator::corePluginsScripts"/>
    <script th:src="@{/static/global/plugins/bootstrap-fileinput/bootstrap-fileinput.js}" type="text/javascript"></script>
    <!--/* 加载全局主题脚本 */-->
    <th:block th:replace="common/thinDecorator::globalThemeScripts"/>
    <!-- BEGIN alert插件 -->
    <script th:src="@{/static/global/plugins/bootstrap-sweetalert/sweetalert.min.js}" type="text/javascript"></script>
    <!-- END -->
    <!--/* 加载全局布局脚本 */-->
    <th:block th:replace="common/thinDecorator::globalLayoutScripts"/>
    <th:block th:replace="common/thinDecorator::globalsetupScripts"/>
    <script th:src="@{/static/global/plugins/vue.min.js}" type="text/javascript"></script>
    <script th:src="@{/static/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js}"
            type="text/javascript"></script>
    <script th:src="@{/static/global/scripts/push/socket.io-1.3.5.min.js}" type="text/javascript"></script>
    <script th:src="@{/static/global/scripts/push/push-sdk.js}" type="text/javascript"></script>
    <script th:src="@{/static/global/plugins/elementUI/index.js}" type="text/javascript"></script>
    <script th:inline="javascript">
        // var authorized = window.Cookies.get('authorized');
        // if (!authorized) {
        //     logoutClear()
        // }
        toastr.options = {
            "closeButton": true,
            "debug": false,
            "positionClass": "toast-top-right",
            "showDuration": "1000",
            "hideDuration": "1000",
            "timeOut": "5000",
            "extendedTimeOut": "1000",
            "showEasing": "swing",
            "hideEasing": "linear",
            "showMethod": "fadeIn",
            "hideMethod": "fadeOut"
        };

        //退出登录清空缓存
        function logoutClear() {
            // window.localStorage.clear();
            window.Cookies.remove('authorized');
            window.location.href = "/logout";
        }
    </script>
    <script th:inline="javascript">

        var app = new Vue({
            el: "#app",
            data: function(){
                var isLight = window.localStorage.getItem("_$system-mode");
                if(isLight === "false") isLight = false;
                else isLight = true;
                return {
                    isLight: isLight,
                    collapse: false,
                    isCollapse: false,
                    systemTitle: "数据资产",
                    groupShow: 0,//是否显示组菜单 0不限 1显示
                    groupActive: "",
                    resourceGroup: [],//资源信息
                    groups: [],//显示的组
                    openeds: [],//打开的子菜单
                    fixedTags: [{
                        name: '首页',
                        url: '/qa/index',
                        reload: 0,
                    }],
                    tags: [],
                    activeTag: "首页",
                    preActiveTag: "首页",
                    ajaxRunning: false,
                    total: 0,
                    rows: [],
                    left: 0,
                    isScroll: false,
                    isAnimate: false
                };
            },
            watch: {
                isLight: function(){
                    window.localStorage.setItem("_$system-mode",this.isLight);
                },
                left: function () {
                    if(this.isAnimate){
                        $("#tagsView").animate({scrollLeft: this.left}, 800);
                        this.isAnimate = false;
                    } else {
                        $("#tagsView").scrollLeft(this.left);
                    }
                },
                collapse: function () {
                    this.isCollapse = true;
                }
            },
            computed: {
                resouces: function(){
                    var data = null;
                    this.openeds = [];
                    for(var i = 0; i < this.resourceGroup.length; i++) {
                        if(this.groupActive == this.resourceGroup[i].name) {
                            data = this.resourceGroup[i].children;
                        }
                    }
                    if(!Array.isArray(data)){
                        data = [];
                    } else if(!this.collapse) {
                        this.getSubOpens(data);
                        this.$nextTick(function(){
                            if(!this.isCollapse) {
                                this.setOpen();
                            } else {
                                var $this = this;
                                setTimeout(function(){
                                    $this.setOpen();
                                },500);
                            }
                            this.isCollapse = false;
                        });
                    }
                    return data;
                },
            },
            methods: {
                init: function(){
                    this.commonFunInit();
                    this.groupSourceInit();
                    this.scrollTag();
                },
                commonFunInit: function(){
                    var $this = this;
                    window.top.test = {
                        implementRefresh: function (url, name, openMode) {
                            $this.resourceSelect({
                                name: name,
                                url: url,
                                openMode: openMode,
                            });
                        },
                        removeNav: function(tag){
                            $this.removeNav(tag)
                        },
                        addTo: function(url, text, refresh){
                            $this.addTag({
                                name: text,
                                url: url,
                                reload: 0,
                                refresh: refresh
                            });
                        },
                    }
                },
                groupSourceInit: function(){
                    var $this = this;
                    var resourceGroup = /*[[${resourceGroups}]]*/ [];
                    this.formatResource(resourceGroup);
                    if(resourceGroup.length > 0 ) this.groupActive = resourceGroup[0].name;
                    this.resourceGroup = resourceGroup;
                    this.showGroup();
                    $(window).resize(function () {
                        $this.showGroup();
                    });
                },
                //组的显示
                showGroup: function(){
                    this.groupShow = 0;
                    this.groups = this.resourceGroup;
                    this.$nextTick(function(){
                        var preleft = 0,lastInde = -1;
                        $(".menu-group-control .el-menu-item").each(function(index){
                            var left = $(this).offset().left;
                            if (left > preleft) {
                                preleft = left;
                                lastInde = index;
                            } else {
                                return false;
                            }
                        });
                        if(lastInde > 0 && lastInde < $(".menu-group-control .el-menu-item").length - 1) {
                            var groups = [];
                            var more = {
                                mid: -100,
                                name: "更多",
                                children: []
                            }
                            for(var i = 0; i < this.resourceGroup.length; i++) {
                                if(lastInde <= i) {
                                    more.children.push(this.resourceGroup[i]);
                                } else {
                                    groups.push(this.resourceGroup[i]);
                                }
                            }
                            groups.push(more);
                            this.groups = groups;
                            this.$nextTick(function(){
                                var moreLeft = $(".menu-group-control .el-submenu").offset().left;
                                if(preleft > moreLeft && this.groups.length > 1) {
                                    more.children.push(this.groups[this.groups.length - 2]);
                                    this.groups.splice(this.groups.length - 2,1);
                                }
                            });
                        }
                        this.groupShow = 1;
                    });
                },
                //资源过滤
                formatResource: function(data){
                    for(var i = data.length - 1; i >= 0; i--) {
                        if(Array.isArray(data[i].children)){
                            this.formatResource(data[i].children);
                        } else {
                            data.splice(i,1);
                        }
                    }
                },
                //左侧默认打开子菜单
                getSubOpens: function(data){
                    for(var i = 0; i < data.length; i++) {
                        if(Array.isArray(data[i].children) && data[i].children.length > 0){
                            this.openeds.push(data[i].name);
                            this.getSubOpens(data[i].children);
                        }
                    }
                },
                //组的选中
                groupSelect: function(key){
                    this.groupActive = key;
                },
                //资源选择
                resourceSelect: function(item){
                    if(item.openMode == 1) {
                        window.open(item.url, "_blank");
                    } else {
                        this.addTag({
                            name: item.name,
                            url: item.url,
                            reload: 0,
                            refresh: item.refresh
                        });
                    }
                },
                //打开子菜单
                setOpen: function() {
                    for(var i = 0; i < this.openeds.length; i++)
                        this.$refs.menus.open(this.openeds[i]);
                },
                //新增标签页
                addTag: function(item){
                    var boo = true,index, hasRefreshUrl = true;
                    if(Array.isArray(item.url)) {
                        item.refreshUrl = item.url[1];
                        item.url = item.url[0];
                    } else {
                        item.refreshUrl = item.url;
                        hasRefreshUrl = false;
                    }
                    for(var i = 0; i < this.fixedTags.length; i++) {
                        if(this.fixedTags[i].name == item.name) {
                            this.fixedTags[i].url = item.url;
                            if(hasRefreshUrl)this.fixedTags[i].refreshUrl = item.refreshUrl;
                            boo = false;
                            break;
                        }
                    }
                    if(boo) {
                        for(var i = 0; i < this.tags.length; i++) {
                            if(this.tags[i].name == item.name) {
                                this.tags[i].url = item.url;
                                if(hasRefreshUrl)this.tags[i].refreshUrl = item.refreshUrl;
                                boo = false;
                                index = i;
                                break;
                            }
                        }
                    }
                    if(boo) {
                        index = this.tags.length;
                        this.tags.push(item);
                    }
                    this.switchTag(item);
                    this.$nextTick(function(){
                        var activeTag = $("#tagsView .tabs-list .el-tag").eq(index),
                            left = $(activeTag).offset().left,
                            width = $(activeTag).outerWidth(),
                            startLeft = $("#tagsView").offset().left,
                            endLeft = startLeft + $("#tagsView").outerWidth();
                        if(left < startLeft) {
                            this.isAnimate = true;
                            this.left -= startLeft - left;
                        } else if(left + width > endLeft) {
                            this.isAnimate = true;
                            this.left += left + width  - endLeft;
                        }
                    });
                },
                //删除标签页
                removeNav: function(tag){
                    var index = 0;
                    for(var i = 0; i < this.tags.length; i++) {
                        if(this.tags[i].name == tag) {
                            index = i;
                            this.tags.splice(i,1);
                            break;
                        }
                    }
                    if(tag == this.activeTag) {
                        if(this.activeTag == this.preActiveTag) {
                            this.activeTag = index == 0 ? this.fixedTags[this.fixedTags.length - 1].name : this.tags[index - 1].name;
                            this.preActiveTag = this.activeTag;
                        } else {
                            this.activeTag = this.preActiveTag;
                        }
                    }
                },
                //切换标签页
                switchTag: function(item){
                    if(this.isScroll){
                        this.isScroll = false;
                        return;
                    }
                    this.preActiveTag = this.activeTag;
                    this.activeTag = item.name;
                    if(item.refresh && typeof item.refresh == "function"){
                        item.refresh();
                    }
                },
                //刷新标签页
                to_Refresh: function(tag){
                    var boo = true;
                    if(!tag) tag = this.activeTag;
                    for(var i = 0; i < this.fixedTags.length; i++) {
                        if(this.fixedTags[i].name == tag) {
                            this.fixedTags[i].reload++;
                            break;
                        }
                    }
                    if(boo) {
                        for(var i = 0; i < this.tags.length; i++) {
                            if(this.tags[i].name == tag) {
                                this.tags[i].reload++;
                                break;
                            }
                        }
                    }
                },
                //设置iframe的地址
                setIframeUrl: function(item){
                    if(item.reload > 0){
                        return item.refreshUrl + (item.refreshUrl.indexOf('?') != -1 ? '&' : '?') + '_reload=' + item.reload;
                    } else {
                        return item.url;
                    }
                },
                setFefresh: function(refresh){
                    var boo = true,index;
                    for(var i = 0; i < this.fixedTags.length; i++) {
                        if(this.fixedTags[i].name == this.activeTag) {
                            this.fixedTags[i].refresh = refresh;
                            boo = false;
                            break;
                        }
                    }
                    if(boo) {
                        for(var i = 0; i < this.tags.length; i++) {
                            if(this.tags[i].name == this.activeTag) {
                                this.tags[i].refresh = refresh;
                                break;
                            }
                        }
                    }
                },
                scrollTag: function () {
                    var $this = this,isRun = false,startPoint = 0;
                    $("#tagsView").mousedown(function(e){
                        isRun = true;
                        startPoint = e.pageX;
                    }).mousemove(function(e){
                        if(isRun) {
                            var left = $this.left - (e.pageX - startPoint),max = $("#tagsView .tabs-list").width() - $("#tagsView").width();
                            if(max >= 0){
                                if(left <= 0) $this.left = 0;
                                else if(left >= max) $this.left = max;
                                else $this.left = left;
                                $this.isScroll = true;
                            }
                            startPoint = e.pageX;
                        }
                    }).mouseup(function(e){
                        isRun = false;
                        startPoint = 0;
                    }).mouseout(function(){
                        isRun = false;
                        startPoint = 0;
                    });

                    $(window).resize(function () {
                        var widthCha = $("#tagsView .tabs-list").width() - $("#tagsView").width();
                        if(widthCha <= 0) {
                            $this.left = 0;
                        } else if($this.left > widthCha) {
                            $this.left -= widthCha;
                        }
                    });
                },
                //退出
                logoutClear: function(){
                    logoutClear();
                },
                refreshTable: function(action){
                    var iframes = document.getElementsByTagName("iframe");
                    for (var i = 0; i < iframes.length; i++) {
                        var srcs = $(iframes[i]).attr("src");
                        if (action == "batchUpLoadReport") {
                            if (srcs.indexOf("/sdm/reportUploadTask/list") != -1 && iframes[i].contentWindow.refreshTab) {
                                iframes[i].contentWindow.refreshTab();//报告上传任务列表刷新
                            }
                            if (srcs.indexOf("/report/list") != -1 && iframes[i].contentWindow.refreshTab) {
                                iframes[i].contentWindow.refreshTab();//报告审批页面列表刷新
                            }
                            if (srcs.indexOf("/entrust/multiConfig/list") != -1 && iframes[i].contentWindow.refreshTab) {
                                iframes[i].contentWindow.refreshTab();//报告生成页面列表刷新
                            }
                        } else if (action == "batchDownLoadReport") {
                            if (srcs.indexOf("/sdm/reportUploadTask/downLoadlist") != -1 && iframes[i].contentWindow.refreshTab) {
                                iframes[i].contentWindow.refreshTab();//报告下载任务列表刷新
                            }
                        }
                    }
                },

            },
            mounted: function(){
                this.init();
            }
        })
    </script>

</div>
</body>
</html>